// 安装告知
<template>
    <f7-page class="common-page page-tab">
      <f7-navbar>
          <f7-nav-left>
              <f7-link back icon-material="chevron_left" force></f7-link>
          </f7-nav-left>
          <f7-nav-title>安装告知</f7-nav-title>
          <f7-nav-right></f7-nav-right>
      </f7-navbar>
      <van-tabs sticky v-model="activeName">
        <van-tab name="#tab1" title="告知回执" key="tab1">
          <!-- <span @click="$f7router.back()">跳转</span> -->
          <!-- 告知回执 -->
          <div id="tab1">
            <template v-if="controlData.receiptFileAttachId">
              <iframe
                  :src="`static/pdfjs/web/viewer.html?file=${path}`"
                  style="border: 0px !important; margin-top: 2px"
                  width="100%"
                  height="600px"
              ></iframe>
            </template>
            <div class="p15" v-else>
              <v-empty description="流程未办结，暂无回执"></v-empty>
            </div>
          </div>
        </van-tab>
        <van-tab name="#tab2" title="基本信息" key="tab2">
          <!-- 基本信息 -->
          <div id="tab2">
            <f7-list media-list class="search-list">
                <li v-for="(item, index) in query.tab2List1" :key="'tab2List1'+index" class="base-info qzjx-card">
                    <div class="title">
                      <span class="label">{{item.label}}</span>
                      <span class="value">{{controlData[item.key][item.key1]||'--'}}</span>
                    </div>
                    <ul class="bottom-list">
                      <li v-for="child in item.children" :key="child.key">
                        <span class="label">{{child.label}}</span>
                        <template v-if="child.key=='equipmentType'">
                          <span class="value">{{controlData[item.key][child.key] | DictItem(controlData.equipmentTypes)}}</span>
                        </template>
                        <template v-else>
                          <span class="value">{{controlData[item.key][child.key]||'--'}}</span>
                        </template>
                      </li>
                    </ul>
                </li>
                <div class="qzjx-card install">
                  <div class="title">安装信息</div>
                  <ul class="bottom-list">
                      <li v-for="(item,index) in query.tab2List2" :key="item.key+index">
                        <span class="label">{{item.label}}</span>
                        <span class="value" v-if="item.key=='planDate'">{{models.notify[item.key]|date('yyyy-MM-dd')}}</span>
                        <span class="value" v-else>{{models.notify[item.key]||'--'}}{{item.unit||''}}</span>
                      </li>
                      <li v-for="item in query.tab2List3" :key="item.key">
                        <span class="label">{{item.label}}</span>
                        <span class="value">{{models.model[item.key]||'--'}}</span>
                      </li>
                    </ul>
                </div>
            </f7-list>
          </div>
        </van-tab>
        <van-tab name="#tab3" title="安装人员" key="tab3">
          <!-- 安装人员 -->
          <div id="tab3" class="p15">
            <v-accordion 
              v-for="(item,index) in query.tab3List" 
              :key="'tab3List'+index"
              :title="item.label" 
              class="qzjx-accordion"
            >
              <div class="p15">
                <template v-if="models[item.key]&&models[item.key].length>0">
                  <div class="img-info-list" v-for="(person,personIndex) in models[item.key]" :key="'personIndex'+personIndex">
                    <img v-if="person.personPhotoAttachId" :src="$util.getImgSrc(person.personPhotoAttachId)" alt="">
                    <img v-else src="../../../../assets/img/qzjx/defaultAvatar.png" alt="">
                    <div class="info-box">
                      <h3>
                        {{person.personName}}
                        <span style="color:#F37A7B;font-size: 12px;font-weight: 400;" v-if="person.isWarn">【一年内存在违章记录】</span>
                        <span style="color:#F37A7B;font-size: 12px;font-weight: 400;" v-if="person.changeOrgNum>=3">【一年内变更过{{person.changeOrgNum}}家企业】</span>
                        <span style="color:#F37A7B;font-size: 12px;font-weight: 400;" v-if="person.staffStatus=='3'">【已移除】</span>

                      </h3>
                      <div>{{person.personMobile}}</div>
                      <p>{{person.workType | DictItem(controlData.personJobTypes)}}</p>
                    </div>
                  </div>
                </template>
                <v-empty v-else description="暂无数据"></v-empty>
              </div>
            </v-accordion>
          </div>
        </van-tab>
        <van-tab name="#tab4" title="附件材料" key="tab4">
          <!-- 附件材料 -->
          <div id="tab4" class="p15">
            <v-accordion 
              v-for="(item,index) in list$1" 
              :key="'tab4List'+index"
              :title="`${index+1}、${item.customName}`" 
              class="qzjx-accordion" 
              :opened="item.attachments.length>0?true:false"
            >
              <div class="p15">
                <div class="sub-title" v-if="item.customDesc">说明：{{item.customDesc}}</div>
                <qm-file-list 
                  :params="{dataKey:models.model.caseId,bizType:item.bizType}" 
                  :uploadId="'fileList'+index"
                  :isDefaultFile="true"
                  :defaultFiles="item.attachments"
                ></qm-file-list>
              </div>
            </v-accordion>
          </div>
        </van-tab>
        <van-tab name="#tab5" title="流程进度" key="tab5">
          <!-- 流程进度 -->
          <div id="tab5" class="p15">
            <section class="qzjx-card">
              <div class="title" style="font-size:16px;">业务流程</div>
              <v-workflow-step :data="history.data" :activeStep="history.activeStep"></v-workflow-step>
            </section>
            <section class="qzjx-card">
              <div class="title" style="font-size:16px;">操作记录</div>
              <v-workflow-list :data="controlData.workflow.history"></v-workflow-list>
            </section>
          </div>
        </van-tab>
      </van-tabs>
      
    </f7-page>
</template>

<script>
import controller from "@/libs/framework/workflowController"
import Config from "@/libs/config.js";
export default class instance extends controller {
    onBeforeInit () {
        this.urls = {
            model: ["/workflow/serviceGuideExt/getEntityByCode","/app/equipment/eqmInstallNotify/workflow/getWorkflowViewModel"],
        };
    }

    onInit () {
      this.$params.appCode = "installNotify";
    }
    // onBeforeQuery (type, conditions, params) {
    //   params.formId=this.$params.caseId
    // }
    onAfterQuery (type, isSuccess, result) {
      if(type=='form'){
        this.context.history=result.controlData.progress
      }else{
        if(!result.controlData.maintenanceOrg) result.controlData.maintenanceOrg={}
        if(!result.controlData.engineeBaseInfo) result.controlData.engineeBaseInfo={}
        if(!result.controlData.installOrg) result.controlData.installOrg={}
        if(!result.controlData.property) result.controlData.property={}
        this.vm.getFileList(
          'EQM_INSTALL_NOTIFY',
          result.models.model.caseId,
          'list$1',
          result.controlData.property.equipmentType
        )
      }
      return result;
    }
    mixin () {
        return {
          components: {},
            data () {
                return {
                  activeName:'#tab1',
                    history:{
                      activeStep:0,
                      data:[
                        {taskName:'告知登记',taskDesc:'安装单位填写安装告知申请',isActive:1},
                        {taskName:'施工总包审核',taskDesc:'施工总包单位审核告知信息',isActive:0},
                        {taskName:'监理审核',taskDesc:'监理单位审核告知信息',isActive:0},
                        {taskName:'监督站审核',taskDesc:'监督站审核告知信息',isActive:0},
                      ]
                    },
                    query: {
                        tab2List1: [
                            {
                                label:'安装设备',
                                key:'property',
                                key1:'propertyCode',
                                children:[
                                  {label:'设备类型',key:'equipmentType'},
                                  {label:'产权单位',key:'enterpriseName'},
                                ]
                            },
                            {
                                label:'用于工程',
                                key:'engineeBaseInfo',
                                key1:'engineeCode',
                                children:[
                                  {label:'工程名称',key:'engineeName'},
                                  {label:'工程地址',key:'engineeAddress'},
                                ]
                            },
                            {
                                label:'安装单位',
                                key:'installOrg',
                                key1:'enterpriseName',
                                children:[
                                  {label:'统一社会信用代码',key:'creditCode'},
                                  {label:'单位地址',key:'address'},
                                ]
                            },
                            {
                                label:'维保单位',
                                key:'maintenanceOrg',
                                key1:'enterpriseName',
                                children:[
                                  {label:'统一社会信用代码',key:'creditCode'},
                                  {label:'单位地址',key:'address'},
                                ]
                            },
                        ],
                        tab2List2: [
                            {
                                label:'计划安装日期',
                                key:'planDate',
                            },
                            {
                                label:'设备在工地编号',
                                key:'workSiteCode',
                            },
                            {
                                label:'在工地安装位置',
                                key:'position',
                            },
                            {
                                label:'本工程最大使用高度',
                                key:'maxHeight',
                                unit:'m',
                            },
                            {
                                label:'初始安装高度',
                                key:'initialHeight',
                                unit:'m',
                            },
                            {
                                label:'起重能力其他设备',
                                key:'liftingCapacity',
                                unit:'kN',
                            },
                            {
                                label:'安装合同号',
                                key:'contractNo',
                            },
                            {
                                label:'安装负责人',
                                key:'contractor',
                            },
                            {
                                label:'负责人联系方式',
                                key:'contractPhone',
                            },
                        ],
                        tab2List3: [
                            {
                                label:'申报人',
                                key:'contact',
                            },
                            {
                                label:'申报人联系方式',
                                key:'contactTel',
                            },
                            {
                                label:'申报人身份证',
                                key:'contactIdcard',
                            },
                        ],
                        tab3List: [
                            {
                                label:'安装单位技术负责人、专职安全员',
                                key:'directorPersonList',
                            },
                            {
                                label:'司索、司机',
                                key:'driverPersonList',
                            },
                            {
                                label:'安拆作业人员',
                                key:'installPersonList',
                            },
                        ],
                    },
                    list$1:[],
                    controlData:{
                      property:{},
                      workflow:{},
                      engineeBaseInfo:{},
                      maintenanceOrg:{},
                      installOrg:{},
                    },
                    models:{
                      model:{},
                      notify:{},
                    }
                };
            },
            computed: {
              path(){
                return encodeURIComponent(this.$util.getFileSrc(this.controlData.receiptFileAttachId))
              },
            },
            methods: {
              getFileList(typeCode,dataKey,name,attachCraneType){
                this.$f7.request.post(
                  '/admin/attachmentFormDetail/listUpload', 
                  {typeCode,dataKey,attachCraneType}, 
                  (r) => {
                    r = JSON.parse(r);
                    if (r?.success&&r.parameters.fileList) {
                      this[name]=r.parameters.fileList
                      return 
                    }
                    this[name]=[]
                    this.$framework.$f7.dialog.toast("获取文件失败");
                  }
                );
              },
            },
            mounted () {
              console.log(this);
            },
        };
    }
}
</script>

<style lang="less" scoped>
@import url('../../../../assets/css/commonPage.less');
#tab3{
  .title{
    font-size: 15px;
  }
}
</style>
